<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />

		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
		Remove this if you use the .htaccess -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

		<title>web04</title>
		<meta name="description" content="" />
		<meta name="author" content="choongang" />

		<meta name="viewport" content="width=device-width; initial-scale=1.0" />

		<!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
		<link rel="shortcut icon" href="/favicon.ico" />
		<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
	
	</head>

	<body>
		<div id="d">div 입니다 </div>
		script 로 모든 Element에 접근할수있습니다
		getElementById("아이디");
		getElementByTagName("태그이름");
		
		<table border="1">
			<tr>
				<td colspan="3">
					<img id="img1" src="http://korean-idol.bamchi.com/photos/images/1845/vertical/open-uri20121206-9425-c67e0b-0." width="500"/>					
				</td>
				<td>
					<input type="text" name="content" value="이걸 바꺼보자" id="content"/>					
				</td>
			<tr>
				<td><img id="img2" src="http://korean-idol.bamchi.com/photos/images/574/vertical/open-uri20120514-26980-lf1uqc." width="200"></td>
				<td><img id="img3" src="http://korean-idol.bamchi.com/photos/images/869/vertical/open-uri20120514-26980-kiwh6v." width="200"></td>
				<td><img id="img4" src="http://korean-idol.bamchi.com/photos/images/1640/vertical/open-uri20120817-24527-tow4hs-0." width="200"></td>
				<td><img id="img5" src="http://korean-idol.bamchi.com/photos/images/119/vertical/open-uri20120511-29295-1fkgc57." width="200"></td>
			</tr>
			</tr>
		</table>
		
		
		<button id="btn1"> 처음사진 </button><br>
		
		<script>
			
			var img1 = document.getElementById("img1");
			var ori = img1.src;
			var img2 = document.getElementById("img2");
			var img3 = document.getElementById("img3");
			var img4 = document.getElementById("img4");
			var img5 = document.getElementById("img5");
			
			var content = document.getElementById("content");
			
			img2.onmouseover=function(){
				img1.src=img2.src;
				content.value="산다라박";
			}
			img3.onmouseover=function(){
				img1.src=img3.src;
				content.value="아이유";
			}
			img4.onmouseover=function(){
				img1.src=img4.src;
				content.value="김태희";
			}
			img5.onmouseover=function(){
				img1.src=img5.src;
				content.value="한지민";
			}
						
			btn1.onclick=function(){
				img1.src=ori;
				content.value="크리스탈";
			}
		</script>
		
	</body>
</html>
